<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />

    

    
    <title>归档 | 李世奇的技术专栏</title>
    
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    
    <meta name="description" content="Fe Coder">
<meta property="og:type" content="website">
<meta property="og:title" content="李世奇的技术专栏">
<meta property="og:url" content="https://www.lisq.xyz/archives/index.html">
<meta property="og:site_name" content="李世奇的技术专栏">
<meta property="og:description" content="Fe Coder">
<meta property="og:locale" content="zh-CN">
<meta name="twitter:card" content="summary">
<meta name="twitter:title" content="李世奇的技术专栏">
<meta name="twitter:description" content="Fe Coder">
    

    

    

    <link rel="stylesheet" href="/libs/font-awesome/css/font-awesome.min.css">
    <link rel="stylesheet" href="/libs/titillium-web/styles.css">
    <link rel="stylesheet" href="/libs/source-code-pro/styles.css">

    <link rel="stylesheet" href="/css/style.css">

    <script src="/libs/jquery/3.3.1/jquery.min.js"></script>
    
    
        <link rel="stylesheet" href="/libs/lightgallery/css/lightgallery.min.css">
    
    
        <link rel="stylesheet" href="/libs/justified-gallery/justifiedGallery.min.css">
    
    
    


</head>


<body>
    <div id="wrap">
        <header id="header">
    <div id="header-outer" class="outer">
        <div class="container">
            <div class="container-inner">
                <div id="header-title">
                    <h1 class="logo-wrap">
                        <a href="/" class="logo"></a>
                    </h1>
                    
                </div>
                <div id="header-inner" class="nav-container">
                    <a id="main-nav-toggle" class="nav-icon fa fa-bars"></a>
                    <div class="nav-container-inner">
                        <ul id="main-nav">
                            
                                <li class="main-nav-list-item" >
                                    <a class="main-nav-list-link" href="/">主页</a>
                                </li>
                            
                                        
                                    
                                <li class="main-nav-list-item" >
                                    <a class="main-nav-list-link" href="https://mp.weixin.qq.com/s/dYZEHTgqvxGV7mL99JuxRQ">关于</a>
                                </li>
                            
                                <li class="main-nav-list-item" >
                                    <a class="main-nav-list-link" href="https://github.com/ConardLi/ConardLi.github.io">更新日志</a>
                                </li>
                            
                                <li class="main-nav-list-item" >
                                    <a class="main-nav-list-link" href="/me/navigation.html">index.导航</a>
                                </li>
                            
                        </ul>
                        <nav id="sub-nav">
                            <div id="search-form-wrap">

    <form class="search-form">
        <input type="text" class="ins-search-input search-form-input" placeholder="搜索" />
        <button type="submit" class="search-form-submit"></button>
    </form>
    <div class="ins-search">
    <div class="ins-search-mask"></div>
    <div class="ins-search-container">
        <div class="ins-input-wrapper">
            <input type="text" class="ins-search-input" placeholder="想要查找什么..." />
            <span class="ins-close ins-selectable"><i class="fa fa-times-circle"></i></span>
        </div>
        <div class="ins-section-wrapper">
            <div class="ins-section-container"></div>
        </div>
    </div>
</div>
<script>
(function (window) {
    var INSIGHT_CONFIG = {
        TRANSLATION: {
            POSTS: '文章',
            PAGES: '页面',
            CATEGORIES: '分类',
            TAGS: '标签',
            UNTITLED: '(未命名)',
        },
        ROOT_URL: '/',
        CONTENT_URL: '/content.json',
    };
    window.INSIGHT_CONFIG = INSIGHT_CONFIG;
})(window);
</script>
<script src="/js/insight.js"></script>

</div>
                        </nav>
                    </div>
                </div>
            </div>
        </div>
    </div>
</header>
        <div class="container">
            <div class="main-body container-inner">
                <div class="main-body-inner">
                    <section id="main">
                        <div class="main-body-header">
    <h1 class="header">
    
    <i class="icon fa fa-archive"></i>归档
    </h1>
</div>

                        <div class="main-body-content">
                            

    
    
        
        
        <section class="archives-wrap">
            <div class="archive-year-wrap">
                <a href="/archives/2019" class="archive-year"><i class="icon fa fa-calendar-o"></i>2019</a>
            </div>
            <div class="archives">
    
    
    
        <div class="article-row">
    
        <article class="article article-summary">
    <div class="article-summary-inner">
        
        <a href="/2019/04/26/【自检】前端知识清单/" class="thumbnail">
    
    
        <span style="background-image:url(https://lsqimg-1257917459.cos.ap-beijing.myqcloud.com/blog/知识体系.png)" alt="【自检】前端知识清单" class="thumbnail-image"></span>
    
    
        
<!-- <span class="">
    <i class="fa fa-comments-o"></i>
    
    <span class="disqus-comment-count" data-disqus-identifier="" data-disqus-url="https://www.lisq.xyz/2019/04/26/【自检】前端知识清单/">0</span>
    
</span> -->

    
</a>

        
        <div class="article-meta">
            <div class="category">
            
            </div>
            <div class="date"><time datetime="2019-04-26T01:11:22.000Z" itemprop="datePublished">2019-04-26</time></div>
        </div>
        
    
        <h1 class="article-title" itemprop="name">
        <a href="/2019/04/26/【自检】前端知识清单/">【自检】前端知识清单</a>
        </h1>
    

        <p class="article-excerpt">
            开篇前端开发是一个非常特殊的行业，它的历史实际上不是很长，但是知识之繁杂，技术迭代速度之快是其他技术所不能比拟的。
winter在他的《重学前端》课程中提到：

到现在为止，前端工程师已经成为研发体系中的重要岗位之一。可是，与此相对的是，我发现极少或者几乎没有大学的计算机专业愿意开设前端课程，更没有系统性的教学方案出现。大部分前端工程师的知识，其实都是来自于实践和工作中零散的学习。

这样是一个非
        </p>
    </div>
</article>
    

    
    
    
    
        <article class="article article-summary">
    <div class="article-summary-inner">
        
        <a href="/2019/04/17/【React深入】深入分析虚拟DOM的渲染原理和特性/" class="thumbnail">
    
    
        <span style="background-image:url(https://lsqimg-1257917459.cos-website.ap-beijing.myqcloud.com/blog/react11.png)" alt="【React深入】深入分析虚拟DOM的渲染原理和特性" class="thumbnail-image"></span>
    
    
        
<!-- <span class="">
    <i class="fa fa-comments-o"></i>
    
    <span class="disqus-comment-count" data-disqus-identifier="" data-disqus-url="https://www.lisq.xyz/2019/04/17/【React深入】深入分析虚拟DOM的渲染原理和特性/">0</span>
    
</span> -->

    
</a>

        
        <div class="article-meta">
            <div class="category">
            
            </div>
            <div class="date"><time datetime="2019-04-17T03:15:27.000Z" itemprop="datePublished">2019-04-17</time></div>
        </div>
        
    
        <h1 class="article-title" itemprop="name">
        <a href="/2019/04/17/【React深入】深入分析虚拟DOM的渲染原理和特性/">【React深入】深入分析虚拟DOM的渲染原理和特性</a>
        </h1>
    

        <p class="article-excerpt">
            
导读React的虚拟DOM和Diff算法是React的非常重要的核心特性，这部分源码也非常复杂，理解这部分知识的原理对更深入的掌握React是非常必要的。
本来想将虚拟DOM和Diff算法放到一篇文章，写完虚拟DOM发现文章已经很长了，所以本篇只分析虚拟DOM。
本篇文章从源码出发，分析虚拟DOM的核心渲染原理（首次渲染），以及React对它做的性能优化点。
说实话React源码真的很难读😅，
        </p>
    </div>
</article>
    
        </div>
    

    
    
    
    
        <div class="article-row">
    
        <article class="article article-summary">
    <div class="article-summary-inner">
        
        <a href="/2019/04/09/【React深入】从Mixin到HOC再到Hook/" class="thumbnail">
    
    
        <span style="background-image:url(https://lsqimg-1257917459.cos-website.ap-beijing.myqcloud.com/blog/hoc9.png)" alt="【React深入】从Mixin到HOC再到Hook" class="thumbnail-image"></span>
    
    
        
<!-- <span class="">
    <i class="fa fa-comments-o"></i>
    
    <span class="disqus-comment-count" data-disqus-identifier="" data-disqus-url="https://www.lisq.xyz/2019/04/09/【React深入】从Mixin到HOC再到Hook/">0</span>
    
</span> -->

    
</a>

        
        <div class="article-meta">
            <div class="category">
            
            </div>
            <div class="date"><time datetime="2019-04-09T15:27:27.000Z" itemprop="datePublished">2019-04-09</time></div>
        </div>
        
    
        <h1 class="article-title" itemprop="name">
        <a href="/2019/04/09/【React深入】从Mixin到HOC再到Hook/">【React深入】从Mixin到HOC再到Hook</a>
        </h1>
    

        <p class="article-excerpt">
            
导读前端发展速度非常之快，页面和组件变得越来越复杂，如何更好的实现状态逻辑复用一直都是应用程序中重要的一部分，这直接关系着应用程序的质量以及维护的难易程度。
本文介绍了React采用的三种实现状态逻辑复用的技术，并分析了他们的实现原理、使用方法、实际应用以及如何选择使用他们。
本文略长，下面是本文的思维导图，您可以从头开始阅读，也可以选择感兴趣的部分阅读：

Mixin设计模式
Mixin（混入
        </p>
    </div>
</article>
    

    
    
    
    
        <article class="article article-summary">
    <div class="article-summary-inner">
        
        <a href="/2019/03/28/【浏览器和网络】全面分析前端的网络请求方式/" class="thumbnail">
    
    
        <span style="background-image:url(/img/network.jpg)" alt="全面分析前端的网络请求方式" class="thumbnail-image"></span>
    
    
        
<!-- <span class="">
    <i class="fa fa-comments-o"></i>
    
    <span class="disqus-comment-count" data-disqus-identifier="" data-disqus-url="https://www.lisq.xyz/2019/03/28/【浏览器和网络】全面分析前端的网络请求方式/">0</span>
    
</span> -->

    
</a>

        
        <div class="article-meta">
            <div class="category">
            
            </div>
            <div class="date"><time datetime="2019-03-28T12:38:59.000Z" itemprop="datePublished">2019-03-28</time></div>
        </div>
        
    
        <h1 class="article-title" itemprop="name">
        <a href="/2019/03/28/【浏览器和网络】全面分析前端的网络请求方式/">全面分析前端的网络请求方式</a>
        </h1>
    

        <p class="article-excerpt">
            
一、前端进行网络请求的关注点大多数情况下，在前端发起一个网络请求我们只需关注下面几点：

传入基本参数（url，请求方式）
请求参数、请求参数类型
设置请求头
获取响应的方式
获取响应头、响应状态、响应结果
异常处理
携带cookie设置
跨域请求

二、前端进行网络请求的方式
form表单、ifream、刷新页面
Ajax - 异步网络请求的开山鼻祖
jQuery - 一个时代
fetch -
        </p>
    </div>
</article>
    
        </div>
    

    
    
    
    
        <div class="article-row">
    
        <article class="article article-summary">
    <div class="article-summary-inner">
        
        <a href="/2019/03/12/【前端工程】前端开发者必备的nginx知识/" class="thumbnail">
    
    
        <span style="background-image:url(/img/nginx.jpg)" alt="前端开发者必备的nginx知识" class="thumbnail-image"></span>
    
    
        
<!-- <span class="">
    <i class="fa fa-comments-o"></i>
    
    <span class="disqus-comment-count" data-disqus-identifier="" data-disqus-url="https://www.lisq.xyz/2019/03/12/【前端工程】前端开发者必备的nginx知识/">0</span>
    
</span> -->

    
</a>

        
        <div class="article-meta">
            <div class="category">
            
            </div>
            <div class="date"><time datetime="2019-03-12T06:50:35.000Z" itemprop="datePublished">2019-03-12</time></div>
        </div>
        
    
        <h1 class="article-title" itemprop="name">
        <a href="/2019/03/12/【前端工程】前端开发者必备的nginx知识/">前端开发者必备的nginx知识</a>
        </h1>
    

        <p class="article-excerpt">
            
nginx在应用程序中的作用
解决跨域
请求过滤
配置gzip
负载均衡
静态资源服务器


nginx是一个高性能的HTTP和反向代理服务器，也是一个通用的TCP/UDP代理服务器，最初由俄罗斯人Igor Sysoev编写。

nginx现在几乎是众多大型网站的必用技术，大多数情况下，我们不需要亲自去配置它，但是了解它在应用程序中所担任的角色，以及如何解决这些问题是非常必要的。
下面我将从ng
        </p>
    </div>
</article>
    

    
    
    
    
        <article class="article article-summary">
    <div class="article-summary-inner">
        
        <a href="/2019/03/06/【JavaScript】深入分析前端小数计算问题/" class="thumbnail">
    
    
        <span style="background-image:url(/img/4.jpg)" alt="深入分析前端小数计算问题" class="thumbnail-image"></span>
    
    
        
<!-- <span class="">
    <i class="fa fa-comments-o"></i>
    
    <span class="disqus-comment-count" data-disqus-identifier="" data-disqus-url="https://www.lisq.xyz/2019/03/06/【JavaScript】深入分析前端小数计算问题/">0</span>
    
</span> -->

    
</a>

        
        <div class="article-meta">
            <div class="category">
            
            </div>
            <div class="date"><time datetime="2019-03-06T08:22:51.000Z" itemprop="datePublished">2019-03-06</time></div>
        </div>
        
    
        <h1 class="article-title" itemprop="name">
        <a href="/2019/03/06/【JavaScript】深入分析前端小数计算问题/">深入分析前端小数计算问题</a>
        </h1>
    

        <p class="article-excerpt">
            
话不多说，先上代码function judgeFloat(n, m) &#123;  const binaryN = n.toString(2);  const binaryM = m.toString(2);  console.log(`$&#123;n&#125;的二进制是    $&#123;binaryN&#125;`);  console.log(`$&#123;m&#125;的二进制
        </p>
    </div>
</article>
    
        </div>
    

    
    
    
    
        <div class="article-row">
    
        <article class="article article-summary">
    <div class="article-summary-inner">
        
        <a href="/2019/03/06/【React深入】React事件机制/" class="thumbnail">
    
    
        <span style="background-image:url(/img/reactevent.jpg)" alt="【React深入】React事件机制" class="thumbnail-image"></span>
    
    
        
<!-- <span class="">
    <i class="fa fa-comments-o"></i>
    
    <span class="disqus-comment-count" data-disqus-identifier="" data-disqus-url="https://www.lisq.xyz/2019/03/06/【React深入】React事件机制/">0</span>
    
</span> -->

    
</a>

        
        <div class="article-meta">
            <div class="category">
            
            </div>
            <div class="date"><time datetime="2019-03-06T08:19:35.000Z" itemprop="datePublished">2019-03-06</time></div>
        </div>
        
    
        <h1 class="article-title" itemprop="name">
        <a href="/2019/03/06/【React深入】React事件机制/">【React深入】React事件机制</a>
        </h1>
    

        <p class="article-excerpt">
            
关于React事件的疑问
1.为什么要手动绑定this

2.React事件和原生事件有什么区别

3.React事件和原生事件的执行顺序，可以混用吗

4.React事件如何解决跨浏览器兼容

5.什么是合成事件


下面是我阅读过源码后，将所有的执行流程总结出来的流程图，不会贴代码，如果你想阅读代码看看具体是如何实现的，可以根据流程图去源码里寻找。
事件注册

组件装载 / 更新。
通过la
        </p>
    </div>
</article>
    

    
    
    
    
        <article class="article article-summary">
    <div class="article-summary-inner">
        
        <a href="/2019/03/06/【React深入】setState的执行机制/" class="thumbnail">
    
    
        <span style="background-image:url(/img/setstate.jpg)" alt="【React深入】setState的执行机制" class="thumbnail-image"></span>
    
    
        
<!-- <span class="">
    <i class="fa fa-comments-o"></i>
    
    <span class="disqus-comment-count" data-disqus-identifier="" data-disqus-url="https://www.lisq.xyz/2019/03/06/【React深入】setState的执行机制/">0</span>
    
</span> -->

    
</a>

        
        <div class="article-meta">
            <div class="category">
            
            </div>
            <div class="date"><time datetime="2019-03-06T08:12:35.000Z" itemprop="datePublished">2019-03-06</time></div>
        </div>
        
    
        <h1 class="article-title" itemprop="name">
        <a href="/2019/03/06/【React深入】setState的执行机制/">【React深入】setState的执行机制</a>
        </h1>
    

        <p class="article-excerpt">
            
一.几个开发中经常会遇到的问题以下几个问题是我们在实际开发中经常会遇到的场景，下面用几个简单的示例代码来还原一下。
1.setState是同步还是异步的，为什么有的时候不能立即拿到更新结果而有的时候可以?1.1 钩子函数和React合成事件中的setState现在有两个组件
componentDidMount() &#123;  console.log('parent componentDidM
        </p>
    </div>
</article>
    
        </div>
    

    
    
        
            </div></section>
        
        
        <section class="archives-wrap">
            <div class="archive-year-wrap">
                <a href="/archives/2018" class="archive-year"><i class="icon fa fa-calendar-o"></i>2018</a>
            </div>
            <div class="archives">
    
    
    
        <div class="article-row">
    
        <article class="article article-summary">
    <div class="article-summary-inner">
        
        <a href="/2018/12/28/【性能优化】前端性能优化总结/" class="thumbnail">
    
    
        <span style="background-image:url(https://www.lisq.xyz/img/9.jpg)" alt="前端性能优化总结" class="thumbnail-image"></span>
    
    
        
<!-- <span class="">
    <i class="fa fa-comments-o"></i>
    
    <span class="disqus-comment-count" data-disqus-identifier="" data-disqus-url="https://www.lisq.xyz/2018/12/28/【性能优化】前端性能优化总结/">0</span>
    
</span> -->

    
</a>

        
        <div class="article-meta">
            <div class="category">
            
            </div>
            <div class="date"><time datetime="2018-12-28T14:33:19.000Z" itemprop="datePublished">2018-12-28</time></div>
        </div>
        
    
        <h1 class="article-title" itemprop="name">
        <a href="/2018/12/28/【性能优化】前端性能优化总结/">前端性能优化总结</a>
        </h1>
    

        <p class="article-excerpt">
            
1.原则多使用内存，缓存或者其他方法
减少CPU计算，减少网络请求
减少IO操作（硬盘读写）
2.加载资源优化静态资源的合并和压缩。
静态资源缓存（浏览器缓存策略）。
使用CDN让静态资源加载更快。
3. 渲染优化CSS放head中，JS放body后
图片懒加载
减少DOM操作，对DOM操作做缓存
减少DOM操作，多个操作尽量合并在一起执行
事件节流
尽早执行操作 DOMContentLoade
        </p>
    </div>
</article>
    

    
    
    
    
        <article class="article article-summary">
    <div class="article-summary-inner">
        
        <a href="/2018/12/17/【electron】指令控制-windows-电源选项/" class="thumbnail">
    
    
        <span style="background-image:url(/img/3.jpg)" alt="指令控制 windows 电源选项" class="thumbnail-image"></span>
    
    
        
<!-- <span class="">
    <i class="fa fa-comments-o"></i>
    
    <span class="disqus-comment-count" data-disqus-identifier="" data-disqus-url="https://www.lisq.xyz/2018/12/17/【electron】指令控制-windows-电源选项/">0</span>
    
</span> -->

    
</a>

        
        <div class="article-meta">
            <div class="category">
            
            </div>
            <div class="date"><time datetime="2018-12-17T10:07:12.000Z" itemprop="datePublished">2018-12-17</time></div>
        </div>
        
    
        <h1 class="article-title" itemprop="name">
        <a href="/2018/12/17/【electron】指令控制-windows-电源选项/">指令控制 windows 电源选项</a>
        </h1>
    

        <p class="article-excerpt">
            
1.powercfg命令。使用powercfg.exe控制电源计划（也称为电源使用方案）。
2.ac和dc一般电源有两种供电模式：
ac代表交流电源
dc代表直流电源
一般情况下ac就是直接接通电源，dc是使用电池供电。
一般电源命令都需要分别设置在ac和dc下的模式。
3.电源选项的唯一标识每个电源选项都有一个唯一的guid标识，我们可以使用某些命令通过这个唯一标识来设定这个电源选项。
例如官
        </p>
    </div>
</article>
    
        </div>
    


    </div></section>


    <nav id="page-nav">
        <span class="pages">第 1 页，共 2 页</span>
        <span class="page-number current">1</span><a class="page-number" href="/archives/page/2/">2</a><a class="extend next" rel="next" href="/archives/page/2/">&raquo;</a>
    </nav>


                        </div>
                    </section>
                    <aside id="sidebar">
    <a class="sidebar-toggle" title="Expand Sidebar"><i class="toggle icon"></i></a>
    <div class="sidebar-top">
        <p>
            关注我 :</p>
        <ul class="social-links">
            
            
            <li>
                <a class="social-tooltip" title="github" href="https://github.com/ConardLi"
                    target="_blank" rel="noopener">
                    <i class="icon fa fa-github"></i>
                </a>
            </li>
            
            
        </ul>
    </div>
    
    <div class="widgets-container" style="background-color: #fff; border-right: 1px solid #e2e2e2;">
        
        
        
<div class="widget-wrap widget-list">
    <h3 class="widget-title">
        微信公众号
    </h3>
    <div class="widget">
        <img src="https://lsqimg-1257917459.cos-website.ap-beijing.myqcloud.com/gzh/qrcode.jpg" alt="">
    </div>
</div>

        
        

        
        
    <div class="widget-wrap">
        <h3 class="widget-title">最新文章</h3>
        <div class="widget">
            <ul id="recent-post" class="">
                
                    <li>
                        
                        <div class="item-thumbnail">
                            <a href="/2019/04/26/【自检】前端知识清单/" class="thumbnail">
    
    
        <span style="background-image:url(https://lsqimg-1257917459.cos.ap-beijing.myqcloud.com/blog/知识体系.png)" alt="【自检】前端知识清单" class="thumbnail-image"></span>
    
    
</a>

                        </div>
                        
                        <div class="item-inner">
                            <p class="item-category"></p>
                            <p class="item-title"><a href="/2019/04/26/【自检】前端知识清单/" class="title">【自检】前端知识清单</a></p>
                            <p class="item-date"><time datetime="2019-04-26T01:11:22.000Z" itemprop="datePublished">2019-04-26</time></p>
                        </div>
                    </li>
                
                    <li>
                        
                        <div class="item-thumbnail">
                            <a href="/2019/04/17/【React深入】深入分析虚拟DOM的渲染原理和特性/" class="thumbnail">
    
    
        <span style="background-image:url(https://lsqimg-1257917459.cos-website.ap-beijing.myqcloud.com/blog/react11.png)" alt="【React深入】深入分析虚拟DOM的渲染原理和特性" class="thumbnail-image"></span>
    
    
</a>

                        </div>
                        
                        <div class="item-inner">
                            <p class="item-category"></p>
                            <p class="item-title"><a href="/2019/04/17/【React深入】深入分析虚拟DOM的渲染原理和特性/" class="title">【React深入】深入分析虚拟DOM的渲染原理和特性</a></p>
                            <p class="item-date"><time datetime="2019-04-17T03:15:27.000Z" itemprop="datePublished">2019-04-17</time></p>
                        </div>
                    </li>
                
                    <li>
                        
                        <div class="item-thumbnail">
                            <a href="/2019/04/09/【React深入】从Mixin到HOC再到Hook/" class="thumbnail">
    
    
        <span style="background-image:url(https://lsqimg-1257917459.cos-website.ap-beijing.myqcloud.com/blog/hoc9.png)" alt="【React深入】从Mixin到HOC再到Hook" class="thumbnail-image"></span>
    
    
</a>

                        </div>
                        
                        <div class="item-inner">
                            <p class="item-category"></p>
                            <p class="item-title"><a href="/2019/04/09/【React深入】从Mixin到HOC再到Hook/" class="title">【React深入】从Mixin到HOC再到Hook</a></p>
                            <p class="item-date"><time datetime="2019-04-09T15:27:27.000Z" itemprop="datePublished">2019-04-09</time></p>
                        </div>
                    </li>
                
                    <li>
                        
                        <div class="item-thumbnail">
                            <a href="/2019/03/28/【浏览器和网络】全面分析前端的网络请求方式/" class="thumbnail">
    
    
        <span style="background-image:url(/img/network.jpg)" alt="全面分析前端的网络请求方式" class="thumbnail-image"></span>
    
    
</a>

                        </div>
                        
                        <div class="item-inner">
                            <p class="item-category"></p>
                            <p class="item-title"><a href="/2019/03/28/【浏览器和网络】全面分析前端的网络请求方式/" class="title">全面分析前端的网络请求方式</a></p>
                            <p class="item-date"><time datetime="2019-03-28T12:38:59.000Z" itemprop="datePublished">2019-03-28</time></p>
                        </div>
                    </li>
                
                    <li>
                        
                        <div class="item-thumbnail">
                            <a href="/2019/03/12/【前端工程】前端开发者必备的nginx知识/" class="thumbnail">
    
    
        <span style="background-image:url(/img/nginx.jpg)" alt="前端开发者必备的nginx知识" class="thumbnail-image"></span>
    
    
</a>

                        </div>
                        
                        <div class="item-inner">
                            <p class="item-category"></p>
                            <p class="item-title"><a href="/2019/03/12/【前端工程】前端开发者必备的nginx知识/" class="title">前端开发者必备的nginx知识</a></p>
                            <p class="item-date"><time datetime="2019-03-12T06:50:35.000Z" itemprop="datePublished">2019-03-12</time></p>
                        </div>
                    </li>
                
            </ul>
        </div>
    </div>

        
        
<div class="widget-wrap widget-list">
    <div class="">
        <h3 class="widget-title">标签</h3>
        <div class="widget widget-wrap-inn">
            <ul class="tag-list"><li class="tag-list-item"><a class="tag-list-link" href="/tags/学习提升/">-学习提升</a><span class="tag-list-count">1</span></li><li class="tag-list-item"><a class="tag-list-link" href="/tags/JavaScript/">JavaScript</a><span class="tag-list-count">1</span></li><li class="tag-list-item"><a class="tag-list-link" href="/tags/React/">React</a><span class="tag-list-count">5</span></li><li class="tag-list-item"><a class="tag-list-link" href="/tags/electron/">electron</a><span class="tag-list-count">3</span></li><li class="tag-list-item"><a class="tag-list-link" href="/tags/nginx/">nginx</a><span class="tag-list-count">1</span></li><li class="tag-list-item"><a class="tag-list-link" href="/tags/博客搭建/">博客搭建</a><span class="tag-list-count">1</span></li><li class="tag-list-item"><a class="tag-list-link" href="/tags/性能优化/">性能优化</a><span class="tag-list-count">1</span></li><li class="tag-list-item"><a class="tag-list-link" href="/tags/浏览器和网络/">浏览器和网络</a><span class="tag-list-count">1</span></li></ul>
        </div>
    </div>
</div>


<style>
    .widget-wrap-inn {
        background-color: white;
        padding: 10px;
        border-radius: 5px;
        border: 1px solid #ddd;
    }
</style>
        
        
<div class="widget-wrap widget-list">
    <h3 class="widget-title">归档</h3>
    <div class="widget  widget-wrap-inn">
        <ul class="archive-list"><li class="archive-list-item"><a class="archive-list-link" href="/archives/2019/04/">四月 2019</a><span class="archive-list-count">3</span></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2019/03/">三月 2019</a><span class="archive-list-count">5</span></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2018/12/">十二月 2018</a><span class="archive-list-count">2</span></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2018/11/">十一月 2018</a><span class="archive-list-count">3</span></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2018/01/">一月 2018</a><span class="archive-list-count">1</span></li></ul>
    </div>
</div>

        
        
<div class="widget-wrap widget-list">
    <h3 class="widget-title">友情链接</h3>
    <div class="widget  widget-wrap-inn">
        <ul>
            
            <li>
                <a href="https://juejin.im/user/5bea27965188250edf4ad8b7">掘金</a>
            </li>
            
            <li>
                <a href="https://segmentfault.com/u/conardli">segmentfault</a>
            </li>
            
            <li>
                <a href="https://github.com/ConardLi">github</a>
            </li>
            
            <li>
                <a href="https://github.com/ConardLi/tpanorama">tpanorama</a>
            </li>
            
            <li>
                <a href="http://chuangzaoshi.com/">创造狮导航</a>
            </li>
            
        </ul>
    </div>
</div>

        
        
<div class="widget-wrap widget-list">
    <!-- <h3 class="widget-title">
        腾讯云专属福利
    </h3> -->
    <div class="widget">
        <a target="_blank"
            href="https://cloud.tencent.com/redirect.php?redirect=1025&cps_key=1a3e7b07487819e129852ba7a4543262&from=console">
            <img src="/img/txy.jpg" id="txy" alt="">
        </a>
    </div>
</div>



<style>
    #txy {
        width: 280px;
        border: 5px;
    }
</style>
        
        
<div class="widget-wrap widget-list">
    <div class="widget">
        <a target="_blank" href="https://promotion.aliyun.com/ntms/act/qwbk.html?userCode=y3kv7eoj">
            <img src="/img/aly.png" id="txy" alt="">
        </a>
    </div>
</div>



<style>
    #txy {
        width: 280px;
        border: 5px;
    }
</style>
        
        
    </div>
</aside>
                </div>
            </div>
        </div>
        <footer id="footer">
    <div class="container">
        <div class="container-inner">
            <a id="back-to-top" href="javascript:;"><i class="icon fa fa-angle-up"></i></a>
            <div class="credit">
                <h1 class="logo-wrap">
                    <a href="/" class="logo"></a>
                </h1>
                <p>&copy;
                    2019
                    ConardLi
                </p>
                <p>Powered by <a href="//hexo.io/" target="_blank">Hexo</a>. Theme by <a href="//github.com/ppoffice"
                        target="_blank">ConardLi</a></p>
                <script type="text/javascript">
                    var cnzz_protocol = (("https:" == document.location.protocol) ? " https://" : " http://");
                    document.write(unescape("%3Cspan id='cnzz_stat_icon_1275088352'%3E%3C/span%3E%3Cscript src='" + cnzz_protocol + "s22.cnzz.com/z_stat.php%3Fid%3D1275088352%26show%3Dpic' type='text/javascript'%3E%3C/script%3E"));
                </script>
                <span id="busuanzi_container_site_pv" style="margin-left:50px;">
                    本站总访问量<span id="busuanzi_value_site_pv"></span>次
                </span>
                <span id="busuanzi_container_site_uv" style="margin-left:50px;">
                    本站访客数<span id="busuanzi_value_site_uv"></span>人次
                </span>
            </div>
            <div class="footer-plugins">
                
    


            </div>
        </div>
    </div>
</footer>
<script async src="//busuanzi.ibruce.info/busuanzi/2.3/busuanzi.pure.mini.js"></script>
        
    
    <script>
    var disqus_shortname = 'hexo-theme-hueman';
    
    
    (function() {
    var dsq = document.createElement('script');
    dsq.type = 'text/javascript';
    dsq.async = true;
    dsq.src = '//' + disqus_shortname + '.disqus.com/count.js';
    (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);
    })();
    </script>




    
        <script src="/libs/lightgallery/js/lightgallery.min.js"></script>
        <script src="/libs/lightgallery/js/lg-thumbnail.min.js"></script>
        <script src="/libs/lightgallery/js/lg-pager.min.js"></script>
        <script src="/libs/lightgallery/js/lg-autoplay.min.js"></script>
        <script src="/libs/lightgallery/js/lg-fullscreen.min.js"></script>
        <script src="/libs/lightgallery/js/lg-zoom.min.js"></script>
        <script src="/libs/lightgallery/js/lg-hash.min.js"></script>
        <script src="/libs/lightgallery/js/lg-share.min.js"></script>
        <script src="/libs/lightgallery/js/lg-video.min.js"></script>
    
    
        <script src="/libs/justified-gallery/jquery.justifiedGallery.min.js"></script>
    
    



<!-- Custom Scripts -->
<script src="/js/main.js"></script>

    </div>
</body>

</html>